@import url("../../utilities.css");

.Note-container {
    display: block;
	margin-top: var(--l);
	margin-left: auto;
	margin-right: var(--l);
    max-width: 50%;
    width: 50%;
	min-width: 300px;
    height: 80vh;
}

.NoteContent-container {
    border: 3px solid  rgba(0,0,0,.1);
	border-radius: 12px;
    color: var(--content-light);
    background-color: var(--background-light);
}

.NoteContent-content {
    color: var(--content-light);
    background-color: var(--background-light);
}

/* 预览框 */
.show {
    /* position: absolute; */
    /* top: 10px; */
    /* right: 0; */
    padding: 0.8rem;
    flex: 1;
    /* background-color: #f5f5f5; */
    width: auto;
    max-height: 80vh;
    height: 80vh;
    box-sizing: border-box;
    overflow: scroll;  
}

/* 编辑或退出按钮 */
.edit_exit {
    /* position: absolute; */
    /* top: 620px; */
    /* right: 460px; */

    margin-top: var(--s);
    margin-right: var(--s);
}

/* 输入文本框 */
#md-editor {
    margin: 0;
    width: 100%;
    height: 80vh;
    overflow: scroll;  
}

/* 下载按钮 */
.download {
    /* position: absolute; */
    /* top: 620px; */
    /* right: 400px; */

    margin-top: var(--s);
    margin-right: var(--s);
}

/* 上传按钮 */
.upload {
    /* position: absolute; */
    /* top: 620px; */
    /* right: 340px; */

    margin-top: var(--s);
    margin-right: var(--s);
}

@media (prefers-color-scheme: dark) {

  .NoteContent-container {
    color: var(--content-dark);
    background-color: var(--background-dark);
    border: 3px solid  rgba(255,255,255,.2);
  }

  .NoteContent-content {
    color: var(--content-dark);
    background-color: var(--background-dark);
  }
}
